<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
	<meta content="yes" name="apple-mobile-web-app-capable">
	<meta content="black" name="apple-mobile-web-app-status-bar-style">
	<meta content="telephone=no" name="format-detection">
	<meta content="email=no" name="format-detection">
	<link rel="stylesheet" href="css/style.css" />
	<title>《2015电视猫年度报告》 </title>
	<style>
		* {
			padding: 0;
			margin: 0;
		}
		/*框架*/
		html {
			-ms-touch-action: none;
		}
		/* 禁止winphone默认触摸事件 */
		body {
			overflow: hidden;
		}

	</style>
</head>
<!--[if lte IE 7]>
<body scroll="no">
<![endif]-->
<!--[if gt IE 7]><!-->
<body>
<!-- 框架[[ -->
<div id="pageContain" class="page-wrap">
	<!--第一页-->
	<div class="page page1 current">
		<div class="contain">
			<div class="page1-contain">
				<img src="img/1-1.png" />
				<img src="img/logo1.png"/>
			</div>
			<div class="content-text homePage-txt">
				<p class="txt-s text-scale">数据时间段：</p>
				<p class="txt-s text-scale">2015年1月1日-2015年12月31日</p>
				<p class="txt-s text-scale">此报告数据来自&nbsp;<em class="txt-b">电视猫数据中心</em></p>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第二页-->
	<div class="page page2">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="page2-contain">
				<div class="page2-pic">
					<img src="img/2-1.png" />
					<img src="img/2-2.png" />
				</div>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第三页-->
	<div class="page page3">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-l txt-b"> 策划并制作专题 <em class="txt-color">962</em>个</p>
				<p class="txt-l">题材涉猎更为广泛丰富</p>
			</div>
			<div class="page3-contain">
				<img src="img/3.png" />
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第四页-->
	<div class="page page4">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-l">年度专题：</p>
				<p class="txt-b txt-l">《天津滨海新区爆炸专题》</p>
			</div>
			<div class="page4-contain">
				<img src="img/4-1.png"/>
				<img src="img/4-2.png"/>
				<img src="img/4-3.jpg"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第五页-->
	<div class="page page5">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-l"> 时事新闻栏目 <em class="txt-b">《今日头条》</em></p>
			</div>
			<div class="page5-contain">
				<img src="img/5-1.png"/>
				<img src="img/5-2.png"/>
				<img src="img/5-3.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第六页-->
	<div class="page page6">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-l"> 娱乐八卦栏目 <em class="txt-b">《今日八卦》</em></p>
			</div>
			<div class="page5-contain">
				<img src="img/6-1.png"/>
				<img src="img/6-2.png"/>
				<img src="img/6-3.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第七页-->
	<div class="page page7">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="page7-contain">
				<img src="img/7-1.png"/>
				<img src="img/7-2.png"/>
				<img src="img/7-3.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第八页-->
	<div class="page page8">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="page8-contain">
				<img src="img/8-1.png"/>
				<img src="img/8-2.png"/>
				<img src="img/8-3.png"/>
				<img src="img/8-4.png"/>
				<img src="img/8-5.png"/>
				<img src="img/8-6.png"/>
				<img src="img/8-7.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第九页-->
	<div class="page page9">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-xl txt-b">煎饼卷大葱 电视看最凶</p>
				<p class="txt-l">孔孟之乡<em class="txt-b txt-color">山东</em>人民成为</p>
				<p class="txt-l">全国最爱看电视的伙伴</p>
			</div>
			<div class="page9-contain">
				<p class="txt-s float-r">*播放量地区排名Top5</p>
				<img src="img/9-1.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第十页-->
	<div class="page page10">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-xl">要<em class="txt-b">&nbsp;追剧&nbsp;</em>就用<em class="txt-b">&nbsp;电视猫&nbsp;</em></p>
				<p class="txt-l"><em class="txt-color">电视剧</em>以压倒性优势占据榜首</p>
			</div>
			<div class="page10-contain">
				<img src="img/10-1.png" />
				<img src="img/10-2.png" />
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--添加-->
	<!--1-->
	<div class="page page17">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-l"><em class="txt-b">早8点</em>&nbsp;收视量逐渐走高</p>
				<p class="txt-l"><em class="txt-b">晚8点</em>&nbsp;依旧电视黄金档</p>
			</div>
			<div class="page17-contain">
				<p class="txt-s float-r">*各时段播放量数据</p>
				<img src="img/20-1.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--2-->
	<div class="page page18">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-l"><em class="txt-b">中青年</em>&nbsp;成为</p>
				<p class="txt-l">智能电视&nbsp;<em class="txt-b">主流</em>用户</p>
			</div>
			<div class="page18-contain">
				<p class="txt-s">*电视猫用户年龄层分布</p>
				<div class="page18-pos-img">
					<img src="img/18-1.png"/>
					<img src="img/18-2.png"/>
				</div>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--3-->
	<div class="page page19">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-xl">有家就有&nbsp;<em class="txt-b">电视猫</em></p>
				<p class="txt-l">多人家庭用户占比近&nbsp;<em class="txt-color">八成</em></p>
			</div>
			<div class="page19-contain">
				<p class="txt-s float-r">*电视猫用户家庭结构分布</p>
				<img src="img/19-1.png"/>
				<img src="img/19-2.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--添加结束-->
	<!--第十一页-->
	<div class="page page11">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text lslide">
				<p class="txt-l"><em class="txt-b">好票房</em> 从预告片开始</p>
				<p class="txt-l">作为影片的&nbsp;<em class="txt-b txt-color">电视合作新媒体</em></p>
			</div>
			<div class="page11-contain">
				<img src="img/11-1.png"/>
				<img src="img/11-1-2.png"/>
				<img src="img/11-2.png"/>
				<img src="img/11-3.jpg"/>
				<img src="img/11-4.jpg"/>
				<img src="img/11-5.jpg"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第十二页-->
	<div class="page page12">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text">
				<p class="txt-l">电影&nbsp;年度收视<em class="txt-color">TOP10</em></p>
			</div>
			<div class="page12-contain">
				<div class="page12-table">
					<div class="page12-pic">
						<img src="img/12-1.png"/>
						<img src="img/12-2.png"/>
						<img src="img/12-3.png"/>
					</div>
					<!-- 表格 -->
					<div class="table">
						<table width="100%" border="0" cellspacing="0" cellpadding="0">
							<tr class="txt-sm">
								<td class="table-w"><div class="table-r">4.道士下山</div></td>
								<!--<td class="">1041万|</td>-->
								<td class=""><div class="table-r">5.侏罗纪世界</div></td>
								<!--<td class="">1020万&nbsp;| </td>-->
								<td class=" ">6.战狼</td>
								<!--<td class=" ">882万</td>-->
							</tr>
							<tr>
								<td class="table-lw"><div class="table-r">7.煎饼侠</div></td>
								<!--<td class="">852万 &nbsp;|</td>-->
								<td class=""><div class="table-r">8.蚁人</div></td>
								<!--<td class="">847万 &nbsp;&nbsp;|</td>-->
								<td class="txt-ss table-w">9.碟中谍5:神秘国度</td>
								<!--<td class="">770万</td>-->
							</tr>
							<tr>
								<td class="txt-sm">10.港囧</td>
								<!--<td class="txt-sm">768万</td>-->
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</table>
					</div>
				</div>
				<div class="page-text">
					<p class="txt-s">*根据电影的总播放量进行排名</p>
				</div>
			</div>
		</div>
		<div class="next">
			<img src="img/next.png" />
		</div>
	</div>
	<!--第十三页-->
	<div class="page page13">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="content-text lslide">
				<p class="txt-l"><em class="txt-b">国产</em>电影&nbsp;全面<em class="txt-b">雄起</em></p>
			</div>
			<div class="page13-contain">
				<p class="txt-s float-r">*电影收视Top10产地分布</p>
				<img src="img/13-1.png"/>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>
		</div>
	</div>
	<!--第十四页-->
	<div class="page page14">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="page14-contain">
				<div class="content-text">
					<p class="txt-l">电视剧&nbsp;年度收视<em class="txt-color">TOP10</em></p>
				</div>
				<div class="page14-table">
					<div class="page14-pic">
						<img src="img/14-1.png"/>
						<img src="img/14-2.png"/>
						<img src="img/14-3.png"/>
					</div>
					<!-- 表格 -->
					<div class="table">
						<table width="100%" border="0" cellspacing="0" cellpadding="0">
							<tr class="txt-sm ">
								<td class="table-w"><div class="table-r">4.大秧歌</div></td>
								<!--<td class=" ">1.03亿&nbsp;|</td>-->
								<td class=""><div class="table-r">5.武媚娘传奇</div></td>
								<!--<td class="">1.01亿&nbsp;|</td>-->
								<td class=" ">6.伪装者</td>
								<!--<td class=" ">0.78亿</td>-->
							</tr>
							<tr class="txt-sm">
								<td class="table-lw"><div class="table-r">7.克拉恋人</div></td>
								<!--<td class="">0.66亿&nbsp;|</td>-->
								<td class=""><div class="table-r">8.虎妈猫爸</div></td>
								<!--<td class=" ">0.62亿&nbsp;|</td>-->
								<td class="txt-ss table-w">9.大汉情缘之云中歌</td>
								<!--<td class="">0.58亿</td>-->
							</tr>
							<tr class="">
								<td class="txt-ss">10.北上广不相信眼泪</td>
								<!--<td class="txt-sm">0.5亿</td>-->
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</table>
					</div>
				</div>
				<div class="page-text">
					<p class="txt-s">*根据电视剧的总播放量进行排名</p>
					<p class="txt-s">*播放量同时受电视剧总集数影响</p>
				</div>
			</div>
		</div>
		<div class="next">
			<img src="img/next.png" />
		</div>
	</div>
	<!--第十五页-->
	<div class="page page15">
		<div class="contain">
			<div class="moreTv-logo">
				<img src="img/s-logo.png" />
			</div>
			<div class="page15-content">
				<div class="content-text">
					<p>年度&nbsp;男演员&nbsp;<em class="txt-b txt-color">TOP3</em></p>
				</div>
				<div class="page15-table">
					<img src="img/15-1.png"/>
					<img src="img/15-2.png"/>
					<img src="img/15-3.png"/>
				</div>
			</div>
			<div class="page15-content">
				<div class="content-text">
					<p>年度&nbsp;女演员&nbsp;<em class="txt-b txt-color">TOP3</em></p>
				</div>
				<div class="page15-table">
					<img src="img/15-4.png"/>
					<img src="img/15-5.png"/>
					<img src="img/15-6.png"/>
				</div>
				<div class="page-text">
					<p class="txt-s">*根据电视剧的总播放量进行排名</p>
				</div>
			</div>
			<div class="next">
				<img src="img/next.png" />
			</div>

		</div>
	</div>
	<!--第十六页-->
	<div class="page page16">
		<div id="page16" class="contain" style="display: block">
			<div class="page16-contain">
				<img src="img/16-1.png"/>
				<img src="img/16-2.png"/>
			</div>
			<div class="lastPage-pic">
				<img src="img/16-3.png"/>
				<img id="shareButton" src="img/16-4.png"/>
			</div>
			<div class="content-text lastPage-txt">
				<p class="txt-s">智能电视必备应用&nbsp;电视猫视频</p>
				<p class="txt-s">www.moretv.com.cn</p>
			</div>
		</div>
		<div id="layer" >
			<div class="layer">
				<img src="img/17-1.png">
			</div>
		</div>
	</div>
</div>
<!-- 框架]] -->
<iframe id="log_ifr" style="display:none;"></iframe>
</body>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/fullPage.min.js"></script>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript">
	//禁止窗口的默认滑动
	document.ontouchmove = function(e) {
		e.preventDefault();
	}
	//框架
	var runPage,
			interval,
			autoPlay;
	autoPlay = function(to) {
		clearTimeout(interval);
		interval = setTimeout(function() {
			runPage.go(to);
		}, 5000);
	}
	runPage = new FullPage({
		id: 'pageContain',		 	// id of contain
		slideTime: 800, 			// time of slide
		continuous: false, 		// create an infinite feel with no endpoints
		effect: { 					// slide effect
			transform: {
				translate: 'Y', 	// 'X'|'Y'|'XY'|'none'
				scale: [1, 1], 		// [scalefrom, scaleto]
				rotate: [0, 0] 		// [rotatefrom, rotateto]
			},
			opacity: [1, 1] 		// [opacityfrom, opacityto]
		},
		mode: 'wheel,touch', 		// mode of fullpage
		easing: 'ease', 			// easing('ease','ease-in','ease-in-out' or use cubic-bezier like [.33, 1.81, 1, 1] )
	});
</script>
<script type="text/javascript">
	/*遮罩点击*/
	var shareButton = document.getElementById("shareButton");
	layer = document.getElementById("layer");
	shareButton.addEventListener("touchstart",phone_touch);
	layer.addEventListener("touchstart",clear_touch);
	function phone_touch(){
		layer.style.display="block";
	}
	function clear_touch(){
		layer.style.display="none";
	}
	/*微信分享*/
	function getWXConfig(){
		$.ajax({
			url:"http://bus.tvmore.com.cn/getsignature?url=" + encodeURIComponent(window.location.href.split('#')[0]),
			dataType : 'jsonp',
			success: function (res) {
				wx.config({
					debug: false,
					appId: res.appId,
					timestamp: res.timestamp,
					nonceStr: res.noncestr,
					signature: res.signature,
					jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "onMenuShareQQ", "onMenuShareWeibo", "startRecord", "stopRecord", "onVoiceRecordEnd", "playVoice", "pauseVoice", "stopVoice", "translateVoice"]
				});
			}
		});
	}
	getWXConfig();
	var imgUrl = "http://portal.moretv.com.cn/activity_web/wchat/professionReport/img/share.jpg";
	var lineLink = "http://portal.moretv.com.cn/activity_web/wchat/professionReport/index.html";
	var descContent = '此报告数据来自【电视猫数据中心】，可能是目前智能电视行业最全面最专业的一份报告。';
	var shareTitle = '《2015电视猫年度报告》 ';
	wx.ready(function(){
		wx.onMenuShareTimeline({
			title: shareTitle, // 分享标题
			link: lineLink, // 分享链接
			imgUrl: imgUrl, // 分享图标
			success: function () {
				// 用户确认分享后执行的回调函数
				upLog(logType.active_share,'share');
			},
			cancel: function () {
				// 用户取消分享后执行的回调函数
			}
		});
		wx.onMenuShareAppMessage({
			title: shareTitle, // 分享标题
			desc: descContent, // 分享描述
			link: lineLink, // 分享链接
			imgUrl: imgUrl, // 分享图标
			type: '', // 分享类型,music、video或link，不填默认为link
			dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
			success: function () {
				// 用户确认分享后执行的回调函数
				upLog(logType.active_share,'share');
			},
			cancel: function () {
				// 用户取消分享后执行的回调函数
			}
		});
		wx.onMenuShareQQ({
			title: shareTitle, // 分享标题
			desc: descContent, // 分享描述
			link: lineLink, // 分享链接
			imgUrl: imgUrl, // 分享图标
			success: function () {
				// 用户确认分享后执行的回调函数
			},
			cancel: function () {
				// 用户取消分享后执行的回调函数
			}
		});
		wx.onMenuShareWeibo({
			title: shareTitle, // 分享标题
			desc: descContent, // 分享描述
			link: lineLink, // 分享链接
			imgUrl: imgUrl, // 分享图标
			success: function () {
				// 用户确认分享后执行的回调函数
			},
			cancel: function () {
				// 用户取消分享后执行的回调函数
			}
		});
	});
	var uuid = function(len, radix){
		var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split(''), uuid = [], i;
		radix = radix || chars.length;

		if (len) {
			// Compact form
			for (i = 0; i < len; i++) uuid[i] = chars[0 | Math.random()*radix];
		} else {
			// rfc4122, version 4 form
			var r;
			// rfc4122 requires these characters
			uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-';
			uuid[14] = '4';
			// Fill in random data.  At i==19 set the high bits of clock sequence as
			// per rfc4122, sec. 4.1.5
			for (i = 0; i < 36; i++) {
				if (!uuid[i]) {
					r = 0 | Math.random()*16;
					uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
				}
			}
		}
		return uuid.join('');
	};
	var setLocalItem = function(name,value,expire){
		try{
			var expireDate = new Date ();
			if(typeof expire != 'undefined' && expire != null){
				expireDate.setTime(expireDate.getTime() + expire);
			}
			if(window.localStorage){
				window.localStorage[name] = value;
			}else{
				document.cookie = name + "=" + escape(value) + ((typeof expire == 'undefined' || expire == null) ? "" : ";expires=" + expireDate.toGMTString())+";path=/";
			}
		}catch(e){}
	};
	var getLocalItem = function(name){
		if(window.localStorage){
			return window.localStorage[name];
		}else{
			if(document.cookie){
				if (document.cookie.length > 0) {
					var begin = document.cookie.indexOf(name + "=");
					if (begin != -1) {
						begin += name.length + 1;//cookie值的初始位置
						var end = document.cookie.indexOf(";", begin);//结束位置
						if (end == -1) {
							end = document.cookie.length;
						}//没有;则end为字符串结束位置
						return unescape(document.cookie.substring(begin, end));
					}else{
						return null;
					}
				}else{
					return null;
				}
			}else{
				return null;
			}
		}
	};
	var getUserId = function(){
		var user_id = 'null';
		var local_user = getLocalItem('_m_tv2_user_id');
		if (!local_user) {
			user_id = uuid().replace(/-/g, '');
			setLocalItem('_m_tv2_user_id', user_id);
		} else {
			user_id = local_user;
		}
		return user_id;
	};
	/*日志记录*/
	var logType = {
		home : 'mobile',
		page : 'mpage',
		active_share : 'active_share',
		active_submit : 'active_submit'
	};
	var upLog = function(log_type,log_page){
		var user_id = getUserId();
		if(!user_id) return;
		var type = '',event = '',logStr = 'http://log.moretv.com.cn/activity';
		switch(log_type){
			case logType.home:
			case logType.page:
				type = 'pageview';
				event = 'view';
				logStr += '?logType='+type+'&event='+event+'&page='+log_page;
				break;
			case logType.active_share:
			case logType.active_submit:
				type = 'operation';
				event = 'click';
				logStr += '?logType='+type+'&event='+event+'&page='+log_page;
				break;
		}
		logStr += '&logVersion=01&userId='+user_id+'&accountId=&activityId=i6efnpuwacu9';
		var t_s = +new Date();
		$('#log_ifr').attr('src', logStr + '&t=' + t_s);
	};
	upLog(logType.home,logType.home);

</script>
</html>